<ui:composition xmlns="http://www.w3.org/1999/xhtml"
                xmlns:ui="http://java.sun.com/jsf/facelets"
                xmlns:p="http://primefaces.org/ui"
                xmlns:h="http://java.sun.com/jsf/html"
                xmlns:f="http://java.sun.com/jsf/core" xmlns:pe="http://primefaces.org/ui/extensions">

    <pe:importEnum type="md.mru.core.domains.type.NodeType" var="nodeType"/>

    <p:dialog header="Administrare nod arbore" dynamic="true" modal="true" widgetVar="treeNodeDialog" resizable="false"
              width="500">

        <h:form id="add_node_form">
            <pe:tooltip global="true" myPosition="left center" atPosition="right center" for="@(.ui-state-error)"/>
            <h:panelGrid columns="2" columnClasses="column-1, column-200" style="margin-bottom:10px"
                         styleClass="form-elements">
                <p:outputLabel for="node_type" value="Tip: "/>
                <p:selectOneMenu id="node_type" value="#{treeAdministrationBean.treeNode.treeNodeType}" filter="true"
                                 filterMatchMode="contains"
                                 converter="#{objectMappingConverter}"
                                 required="true" disabled="#{treeAdministrationBean.treeNode.id gt 0}"
                                 styleClass="tree-node_types">
                    <f:selectItem itemLabel="Selectati tipul nodului ..." noSelectionOption="true"/>
                    <f:selectItems var="f" itemLabel="#{f.functionCategory.shortName} > #{f.name}" itemValue="#{f}"
                                   value="#{treeAdministrationBean.treeNodeTypes}"/>
                    <p:ajax listener="#{treeAdministrationBean.onTreeNodeTypeSelect}" process="@this"
                            update="node_name @(.office-location)"/>
                </p:selectOneMenu>

                <p:outputLabel for="node_name" value="Denumire: "/>
                <p:inputText id="node_name" value="#{treeAdministrationBean.treeNode.name}"
                             required="true" title="Denumirea este necesara."
                             disabled="#{treeAdministrationBean.positionTreeNodeType}"/>

                <p:outputLabel for="phone_no" value="Telefon de contact: "/>
                <p:inputMask id="phone_no" value="#{treeAdministrationBean.treeNode.phoneNo}" mask="+373 (999) 999 99?9"/>

                <p:outputPanel styleClass="office-location">
                    <p:outputLabel for="office_location" value="Locatie birou: "
                                   rendered="#{treeAdministrationBean.treeNode.treeNodeType.nodeType==nodeType.FOLDER_OFFICE}"/>
                </p:outputPanel>
                <p:outputPanel styleClass="office-location">
                    <p:inputText id="office_location" value="#{treeAdministrationBean.treeNode.officeLocation}" required="true" title="Birou locatie este necesara."
                                 rendered="#{treeAdministrationBean.treeNode.treeNodeType.nodeType==nodeType.FOLDER_OFFICE}"/>
                </p:outputPanel>

                <p:outputLabel for="description" value="Description: "/>
                <p:inputTextarea id="description" value="#{treeAdministrationBean.treeNode.description}"/>
            </h:panelGrid>

            <p:outputPanel layout="block" style="border-top: 1px solid #A8A8A8; padding: 5px;">
                <p:commandButton value="Salvează" actionListener="#{treeAdministrationBean.saveTreeNode}"
                                 oncomplete="if (args &amp;&amp; !args.validationFailed) {treeNodeDialog.hide()};"
                                 update="@form :trees_panel" process="@form"/>
                <p:commandButton immediate="true" value="Anulează" oncomplete="treeNodeDialog.hide();"
                                 resetValues="true"/>
            </p:outputPanel>
        </h:form>
    </p:dialog>

</ui:composition>